<template>
  <div>
    <activities-form @formSubmit = 'formSubmit'></activities-form>
    <p>
      <el-button type="primary" @click="$router.push({path: '/operational/createCampaign'})">创建营销活动</el-button>
    </p>
    <activities-table
      :data='tableData'
      @updateTable = 'getActivitesData'
    ></activities-table>
    <div class="mt20">
      <el-pagination
        @size-change = "changeSize"
        @current-change="changePage"
        :current-page="page"
        :page-size ='curSize'
        :page-sizes="pageSizes"
        layout="total,sizes, prev, pager, next, jumper"
        :total="count">
      </el-pagination>
    </div>
  </div>
</template>
<script>
  import activitiesForm from 'src/components/operational/activitiesForm.vue'
  import activitiesTable from 'src/components/operational/activitiesListTable.vue'
  import {
    getPriceStrategyList
  } from 'src/api/index.js'
  export default {
    data () {
      return {
        page: 1,
        param: {},
        tableData: [],
        count: 20,
        size: 10,
        curPage: this.page,
        curSize: 10
      }
    },
    watch: {
      '$route': 'getActivitesData'
    },
    created () {
      this.getActivitesData()
    },
    methods: {
      formSubmit (baseParam) {
        // let that = this
        this.param = baseParam
        // TODO: url记录页面位置
        // this.$router.push({
        //   path: '/operational/activitiesList',
        //   query: {
        //     page: that.page,
        //     size: that.curSize,
        //     ...this.param
        //   }
        // })
        this.getActivitesData()
      },
      getActivitesData () {
        let that = this
        getPriceStrategyList({
          page: this.page,
          size: this.curSize,
          ...this.param
        }).then((res) => {
          let result = res.data
          if (result.code === 100) {
            this.count = result.data.count
            this.page = result.data.page
            that.tableData = result.data.list
          }
        })
      },
      changeSize (val) {
        this.curSize = val
        this.formSubmit()
      },
      changePage (val) {
        this.page = val
        this.formSubmit()
      }
    },
    computed: {
      pageSizes () {
        return [this.size, this.size * 2, this.size * 3]
      }
    },
    components: {
      activitiesForm,
      activitiesTable
    }
  }
</script>
